<!DOCTYPE html>
<html>
<head>
    <title>ICON font 图标转换</title>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
</head>
<style>
    input, textarea {
        width: 700px;
    }

    #result, #data {
        height: 500px;
    }
</style>
<body>

<table>
    <tr>
        <td>内容</td>
        <td>
            <textarea type="text" id="data"></textarea>
        </td>

    </tr>
    <tr>
        <td>结果</td>
        <td>
            <textarea id="result"></textarea>
        </td>
    </tr>

</table>
<button onclick="generate()">生成</button>
<script type="text/javascript">
    function generate() {
        var regx = /\.(.*):before/g;
        var data = $("#data").val();
        var iconArr = execAllReg(regx, data);
        var result = "";
        for (var item in iconArr) {
            item = '<li><i style="font-size: 28px" class="icon iconfont iconfont ' + iconArr[item][1] + '">' + iconArr[item][1] + '</i></li>';
            result += item + "\n";
        }
        $("#result").val(result);
    }

    function execAllReg(reg, str) {
        var result = new Array();
        var rs
        while ((rs = reg.exec(str)) != null)  //获取所有匹配的字符串
        {
            result.push(rs);
        }
        return result;
    }
</script>
</body>
</html>

